<template lang='pug'>
.myaddress
  template(v-if="addressList.length != 0")
    ul.show-address
      li(v-for="item in addressList",@click.stop="setAddress(item)")
        .icon(:class="[item.addressId==userAddressInfo.addressId?'isloaction':'']")
        p.thename {{item.userName}}/{{item.phone}}
        p.addr 收货地址：{{item.poiName}}{{item.pathName}}{{item.houseNumber}}
        router-link(to="/",v-if="item.addressId==userAddressInfo.addressId").useNow 使用当前地址
        template(v-if="islink")
          i.right-icon
        template(v-else)
          a(href="javascript:;",@click.stop="edit(item)").edit 编辑
    a(href="javascript:;",@click="addNewAddress").add-new-add 新增地址
  template(v-else)
    .errImg
    p.errmsg 啊哦，您还没有收货地址，快去增加一个吧~
    a(href="javascript:;",@click="addNewAddress").add-noadd 新增地址
</template>
<script>
import fetch from '@/config/fetch'
import { mapGetters } from 'vuex'
import { setSelectedPositionCookie } from '@/config/utils'
import { mdm, tps, snxd } from '@/config/env'
import { getarea } from '@/service/getData'
export default {
    data() {
        return {
            addressList: [],//我的地址列表
            islink: false,// 显示箭头
            userAddressInfo: {},// 用户当前使用地址
            from: '',//从哪边进入此页面
            cartLink: '',//跳回购物车的地址 
        }
    },
    created() {
        let link = this.$route.query.cartLink
        if (!!link) {
            this.cartLink = link;
            this.from = 'cart2'
            // this.islink = true
        }
        let type = this.$route.params.type
        if (type == 'my') {
            this.islink = true
            this.from = 'my'
        } else {
            this.getUserAddressInfo()
        }
        if (!link && !type) {
            this.cartLink = '';
            this.from = ''
        }
        this.getAddressList()
        // this.getUserAddressInfo()
    },
    methods: {
        getUserAddressInfo() {
            this.userAddressInfo = this.defaultAddress
        },
        getAddressList() {
            var url;
            if (this.from == 'cart2') {
                url = `${snxd}/address/query.do?source=wap&version=3.2.2&areaId=${this.$store.state.position.areaId}`
            } else {
                url = `${snxd}/address/query.do?source=wap&version=3.2.2`
            }
            fetch({
                url: url,
                params: {}
            }).then(res => {
                if (res.code == '1') {
                    this.addressList = res.data.addressList
                } else if (res.code == '0') {
                    alert(res.msg)
                }
            })
        },
        setAddress(item) {
            // 从个人中心进入页面无效果
            if (item.mdmCityCode == '1000180') {
                AlertBox({
                    type: 'onceConfirm',
                    msg: '很抱歉，徐州苏鲜生暂不支持该服务'
                })
                return
            }
            if (this.from == 'my') {
                this.edit(item)
                return
            }
            if (this.from == 'cart2') {
                // 从购物车2进入此页面
                if (item.poiId == this.position.poiId) {
                    this.setAddress2(item);
                    return
                }
                if (item.storeMold == '3') {
                    AlertBox({
                        msg: '您的收货地址暂不支持配送，请更换其他收货地址!',
                        type: 'onceConfirm',
                    });
                }
                if (item.storeMold == '0') {
                    let self = this
                    self.setAddress2(item)
                    // 同一区域内不提示价格变动信息
                    // AlertBox({
                    //   type: 'doubleBtn',
                    //   msg: '切换地址后商品或价格可能会产生变动!',
                    //   confirm: function () {
                    //     self.setAddress2(item)
                    //   }
                    // });
                }

            } else {
                let p = {
                    storeLocation: item.storeLocation,
                    cityName: item.cityName,
                    cityCode: item.mdmCityCode,
                    storeName: item.storeName,
                    storeCode: item.storeCode,
                    poiId: item.poiId,
                    poiName: item.poiName,
                    areaId: item.areaId
                }
                let id = {
                    addressId: item.addressId
                }
                setSelectedPositionCookie(p)
                this.$store.commit('setPosition', p);
                this.$store.commit('setDefaultAddress', id);
                this.$router.push({ path: '/' })
            }
        },
        // 购物车地址设置
        setAddress2(item) {
            let p = {
                storeLocation: item.storeLocation,
                cityName: item.cityName,
                cityCode: item.mdmCityCode,
                storeName: item.storeName,
                storeCode: item.storeCode,
                poiId: item.poiId,
                poiName: item.poiName,
                areaId: item.areaId
            }
            let id = {
                addressId: item.addressId
            }
            setSelectedPositionCookie(p)
            this.$store.commit('setPosition', p);
            this.$store.commit('setDefaultAddress', id);
            this.$store.commit('setUserInfo', item)
            this.$router.push({ path: this.cartLink })
        },
        edit(item) {
            let p = {
                storeLocation: item.storeLocation,
                cityName: item.cityName,
                cityCode: item.mdmCityCode,
                storeName: item.storeName,
                storeCode: item.storeCode,
                poiId: item.poiId,
                poiName: item.poiName,
                provCode: item.provCode,
                areaId: item.areaId
            }
            let d = {
                addressId: item.addressId,
                userName: item.userName,
                phone: item.phone,
                pathName: item.pathName,
                houseNumber: item.houseNumber,
                poiPath: item.poiPath
            }
            this.$store.commit('setBeforePosition', p);
            this.$store.commit('setDetailAddress', d);
            let to = '/address/edit'
            if (this.from == 'cart2') {
                to = `/address/edit/cart2?cartLink=${this.cartLink}`
            }
            this.$router.push({ path: to })
        },
        addNewAddress() {
            let p = this.$store.state.position
            let to = '/address/edit'
            if (this.from == 'cart2') {
                to = `/address/edit/cart2?cartLink=${this.cartLink}`
            }
            getarea({
                storeLocation: p.storeLocation,
                version: '3.2.2',
                poiId: p.poiId,
                cityCode: p.cityCode
            }).then(res => {
                if (!res.data.provCode) {
                    return error
                }
                this.$store.commit('setBeforePosition', {
                    cityName: p.cityName,
                    poiName: p.poiName,
                    cityCode: p.cityCode,
                    poiId: p.poiId,
                    provCode: res.data.provCode
                });
                this.$store.commit('setDetailAddress', {});
                this.$router.push({ path: to })
            }).catch(res => {
                this.$store.commit('setBeforePosition', {
                    cityName: p.cityName,
                    cityCode: p.cityCode,
                });
                this.$store.commit('setDetailAddress', {});
                this.$router.push({ path: to })
            })
        }
    },
    computed: {
        ...mapGetters([
            'position', 'defaultAddress'
        ])
    }
}
</script>
<style lang='scss' scoped>
@import '../tool.scss';
.myaddress {
    background: #f2f2f2;
    .errImg {
        width: _(360);
        height: _(360);
        margin: 0 auto;
        margin-top: _(291);
        background-image: url('/static/images/noAddress.png');
        background-size: 100% 100%;
    }
    .errmsg {
        display: block;
        margin: 0 auto;
        margin-top: _(20);
        width: _(600);
        text-align: center;
        color: #999;
        font-size: _(30);
    }
    .add-noadd {
        display: block;
        width: _(600);
        height: _(80);
        background-color: #ff7c33;
        text-align: center;
        font-size: _(30);
        line-height: _(80);
        margin: 0 auto;
        color: #fff;
        margin-top: _(39)
    }
}

.show-address {
    width: 100%;
    overflow: hidden;
    background: #f2f2f2;
    padding-bottom: toRem(140);
    li {
        width: 100%;
    }
    .icon {
        position: absolute;
        width: toRem(44);
        height: toRem(44);
        background-image: url('/static/images/nol.png');
        background-size: 100% 100%;
        top: toRem(23);
        left: toRem(29);
    }
    .isloaction {
        background-image: url('/static/images/isl.png');
    }
    li {
        background-color: #fff;
        width: toRem(750);
        height: toRem(125);
        border-bottom: 1px solid #f0f0f0;
        overflow: hidden;
        position: relative;
        p {
            display: inline-block;
            margin-left: toRem(100);
            width: toRem(500);
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .useNow {
            position: absolute;
            top: toRem(24);
            right: toRem(117);
            width: toRem(150);
            height: toRem(38);
            text-align: center;
            line-height: toRem(38);
            overflow: hidden;
            color: #fff;
            background-color: #ffc001;
            font-size: toRem(22);
        }
        .thename {
            color: #444;
            line-height: toRem(41);
            font-size: toRem(28);
            margin-top: toRem(24);
        }
        .addr {
            font-size: toRem(24);
            line-height: toRem(33);
            color: #999;
        }
        .edit {
            position: absolute;
            display: block;
            line-height: toRem(30);
            top: toRem(24);
            right: toRem(29);
            color: #ff7c33;
            border: 1px solid #ff7c33;
            font-size: toRem(22);
            border-radius: toRem(4);
            padding: toRem(4) toRem(12);
        }
        .right-icon {
            display: block;
            width: _(12);
            height: _(20);
            position: absolute;
            top: _(33);
            right: _(28);
            background-image: url('/static/images/rightb.png');
            background-size: 100% 100%;
        }
    }
}

.add-new-add {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: toRem(98);
    color: #fff;
    line-height: toRem(98);
    font-size: toRem(36);
    text-align: center;
    background-color: #ff7c33;
}
</style>